<html>
    <head>
        <meta charset="utf-8">
        <meta name="author" content="xsl">
        <title>exercise</title>
        <style>
            body{
                width: 100%;
                height: 100%;
                background-image: url(img/timg1.jpg);
                background-size: 100% 100%;
                background-repeat: no-repeat;
            }
            a{
                text-decoration: none;
                color: purple;
                font-family: '微软雅黑';
                font-size: 20px;
            }
            a:hover{
                color: black;
                box-shadow: 0 0 5px blue;
            }
            ul{
                list-style: none;
                position: relative;
                top: 100px;
                left: 50px;
            }
            ul li{
                margin: 1vh;
            }
            
        </style>
    </head>
    <body>
        <ul>
            <li><a href="01-订单.html" target="_blank">01-订单</a></li>
            <li><a href="02-选项卡.html" target="_blank">02-选项卡</a></li>
            <li><a href="03-下拉菜单.html" target="_blank">03-下拉菜单</a></li>
            <li><a href="04-模拟select.html" target="_blank">04-模拟select</a></li>
            <li><a href="01-鼠标放上去显示遮罩层.html" target="_blank">05-显示遮罩层</a></li>
            <li><a href="02-JQ轮播图.html" target="_blank">06-JQ轮播图</a></li>
            <li><a href="03-五星好评.html" target="_blank">07-五星好评</a></li>
            <li><a href="04-点击加号上传图片.html" target="_blank">08-点击加号上传图片</a></li>
            <li><a href="05-弹窗.html" target="_blank">09-弹窗</a></li>
            <li><a href="20.1-图片切换.html" target="_blank">10-图片切换</a></li>
            <li><a href="20.2-图片翻转切换.html" target="_blank">11-图片翻转切换</a></li>
            <li><a href="20.3-置顶效果.html" target="_blank">12-置顶效果</a></li>
            <li><a href="20.4-检测用户输入字数.html" target="_blank">13-检测用户输入字数</a></li>
            <li><a href="21.1-商品筛选.html" target="_blank">14-商品筛选</a></li>
        </ul>
    </body>
</html>